 @extends('template/master')	
	@section('pageTitle')
		{{ Lang::get('label.homePageTitle')}}
	@stop
	
	@section('content')
	  <!-- Page Content -->
    <div class="container">

        <div class="row">

            <!-- column7 -->
            <div class="col-md-7" style="border-right:1px #ccc solid;">
				<ol class="breadcrumb">
  					<li><a href="index.html">Home</a></li>
					<li>{{$headerMenu }}</li>
				</ol>
				
					<!-- category main news -->
					<h1 class="title">{{$headerMenu }}</h1>
					<?php if($latestCatNews){ $first = $latestCatNews[0]; ?>
                    <h4 class="title4">{{ $first->title }}</h4>
					<span class="time-date">{{ date(Options::DATE_TIME_FORMAT,strtotime($first->created_at)) }} &nbsp;|&nbsp; <img src="../images/comment.png"> 0 </span>

					<div class="category-main-img-space"><img class="img-responsive" src="{{ '../'.$first->featurePhoto}}" alt="" width="100%"></div>
										
					<!-- >div class="caption">Lorem ipsum dolor sit amet, consectetur adipiscing elit.  – The Sabah Kini file pic, July 30, 2014.</div-->
					
					
					
					<div class="category-main-text">
						<p>{{ $first->descriptions }}</p>	
					<div class="more"><a href="{{ SEO::generateNewsURL($first->id,$first->title) }}" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image25','','../images/more-hover.jpg',1)"><img src="../images/more.jpg" name="Image25" width="57" height="18" border="0"></a></div>
					
					</div><!-- category-text -->
					
					<?php }?>
					
            </div><!-- / column7-->

            <!-- Sidebar -->
            <div class="col-md-5">

        	<div class="clearfix"></div>

               <h1 class="title-space">latest {{ $headerMenu }} news</h1>
                    <div class="row">
                        <div class="col-lg-12 clear-padding">
                         
						   <div class="panel-group" id="accordion">
			<div class="panel panel-default">
				
				<div id="collapseOne" class="panel-collapse collapse in">
					<div class="panel-body" style="padding-top:0px;">
						<?php if($latestCatNews){
							$n=0;
							foreach ($latestCatNews as $newCat){
							if($n>0){
						?>

							<div class="col-md-12 col-lg-12 col-xs-12 col-sm-12 clear-padding">
							   	<h2 class="title2"><a href="{{ SEO::generateNewsURL($newCat->id,$newCat->title) }}">{{ $newCat->title }}</a></h2>
								<div class="col-xs-12 col-sm-12 col-md-4 col-lg-3 clear-padding" style="padding-right:15px; padding-top:5px;">
									<a href="{{ SEO::generateNewsURL($newCat->id,$newCat->title) }}"><img src="{{ '../'.$newCat->featurePhoto}}" class="img-responsive" width="107" height="76"></a>
								</div>
								<div class="col-xs-12 col-sm-12 col-md-8 col-lg-9 clear-padding">
									<a href="{{ SEO::generateNewsURL($newCat->id,$newCat->title) }}" class="news-style">KUALA LUMPUR: {{$newCat->descriptions }}</a>
									<br><span class="time-date">{{ date(Options::DATE_TIME_FORMAT,strtotime($newCat->created_at)) }}</span>
								</div>
							</div><!-- / column12-->
							
						<?php }$n++;}}?>	
							
					</div>
				</div>
			</div>
		</div>
				 </div>
                        <!-- /.col-lg-12 -->
                        
                    </div>
                    <!-- /.row -->

            </div>  <!-- /.col-md-5-->
        </div> <!-- /.row -->
				
				<div class="row">
				<div class="clearfix"></div>
				
					<h1 class="title" style="margin-left:15px; "><?php echo Lang::get('label.mostViewed'); ?></h1>
				     <div class="col-md-12 col-lg-12 clear-padding">
						<!-- load data click phan trang -->
						<div id="results"></div>
						<?php if($numberItem >6){?>														
							<div class="load_more load-more" id="load_more_button"><span  onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image22','','../images/load-more-hover.jpg',1)"><img src="../images/load-more.jpg" name="Image22" width="80" height="18" border="0"></span></div>
							<div class="animation_image" style="display:none;">Loading...</div>
						<?php }?>
						<!-- end -->	
					 </div><!-- / col-md-12-->
					  
					<div class="clearfix"></div>
					<h1 class="title" style="margin-left:15px;"><?php echo Lang::get('label.mostCommented'); ?></h1>
					<div class="col-md-12 col-lg-12 clear-padding">					
					<div class="load-more"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image21','','../images/load-more-hover.jpg',1)"><img src="../images/load-more.jpg" name="Image21" width="80" height="18" border="0"></a></div>
					
					</div><!-- / col-md-12-->
					
				</div><!-- / row-->

    </div> 
    <?php 
    	$total_pages = ceil($numberItem/6);    	
    ?>
	<!-- /.container -->
	<script type="text/javascript">
			$(document).ready(function() {		
				var track_click = 0; 			
				var total_pages = <?php echo $total_pages; ?>;				
				$('#results').load(
							"/getdata", {
								'page':track_click}, function() {									
									track_click++;									
								}); 		
				$(".load_more").click(function (e) { 			
					$(this).hide(); 				
					$('.animation_image').show(); 						
					if(track_click < total_pages){					
						$.post('/getdata',{'page': track_click}, function(data) {					
							$(".load_more").show(); 						
							$("#results").append(data);
							//$("html, body").animate({scrollTop: $("#load_more_button").offset().top}, 500);
							$('.animation_image').hide();							
							track_click++; 
							
						}).fail(function(xhr, ajaxOptions, thrownError) { 
							alert(thrownError); 							
							$(".load_more").show(); 
							$('.animation_image').hide(); 
						});
						if(track_click >= total_pages-1){
														
							$(".load_more").attr("disabled", "disabled");
						}
					 }
					  
					});
			});
	</script>
     @stop

   